<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@page contentType="text/html" pageEncoding="UTF-8"%>
<jsp:useBean id="usuario" class="Model.Usuario" scope="session" />
<!DOCTYPE html>
<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
        <script type="text/javascript" src="js/validation.js" charset="utf-8"></script>
        <link rel="stylesheet" type="text/css" href="css/css.css">
        <title>Cadastro de Usuário</title>
    </head>
    <body>

        <h1>Cadastro de Usuário</h1>

        <form id="cad-user" name="cad-user" method="POST" action="ServletUsuario?opt=insert<c:if test="${usuario.getLogin() != null}">&edit=yes</c:if>" onsubmit="return valid_cad_user();">
            <fieldset>
                <table> 
                    <tr> 
                        <td width="2"> <label for="name">Nome: </label> </td>
                        <td> <input type = "text" id ="name" name="name" value="${usuario.getName()}" required> </td>
                    </tr> 
                    <tr> 
                        <td> <label for="city">Cidade: </label> </td>
                        <td> <input id ="city" name="city" value="${usuario.getCity()}" required> </td> 
                        <td> <label for="state">Estado: </label> </td>
                        <td> <select id="state" name="state" required>
                                <jsp:useBean id="states" class="Model.State"/>
                                <c:forEach var="state" items="${states.getUf()}">
                                    <option value="${state.getValue()}"<c:if test="${usuario.getState()== state.getValue()}">selected</c:if> >${state.getValue()}</option>
                                </c:forEach>

                            </select> 
                        </td>

                    </tr> 
                    <tr>
                        <td> <label for="telephone">Telefone: </label> </td>
                        <td> <input id="telephone" name="telephone" placeholder="(xx) xxxx-xxxx" value="${usuario.getPhone()}" required> </td>
                    </tr>
                    <tr>
                        <td>  <label for="email">Login: </label> </td>
                        <td> <input type="email" id="email" name="email" value="${usuario.getLogin()}" <c:if test="${usuario.getLogin() != null}">readonly</c:if>  required> </td>
                    </tr>
                    <tr>
                        <td> <label for="pass">Senha: </label> </td>
                        <td> <input type="password" id="pass" name="pass" value="${usuario.getPassword()}" required></td>
                        <td> <label for="confirm-pass">Confirmar senha: </label> </td>
                        <td> <input type="password" id="confirm-pass" name="confirm-pass" value="${usuario.getPassword()}" required> </td>
                    </tr>

                </table>
                <br>        
                <input type="submit" value="Cadastrar">
            </fieldset>
        </form>
    </body>
</html>
